<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
    <title>商城，控制在25个字、50个字节以内</title>
    <meta name="keywords" content="关键词,5个左右,单个8汉字以内">
    <meta name="description" content="网站描述，字数尽量空制在80个汉字，160个字符以内！">
    <link rel="Bookmark" href="favicon.ico">

    <link href="css/reset.css" rel="stylesheet" type="text/css"/>
    <link href="css/style.css" rel="stylesheet" type="text/css"/>
    <link href="css/dateSelect.css" rel="stylesheet" type="text/css"/>
</head>

<body class="baise" style="height: 3000px;">
<#include "../common/header.ftl" />
<@person></@person>
<@headmiddle></@headmiddle>
<@navigation></@navigation>
<div class="container cf mt20 mb20">
    <div class="width970">
        <!--放大产品-->
        <div class="zoom">
            <div class="zoomMiddle">
            <#if hfGood??>
                <input type="hidden" id="hfUid" value="${hfGood.hfUid?long?c}"/>
                <input type="hidden" id="shopId" value="${hfGood.shopId?long?c}"/>
                <input type="hidden" id="taobaoPrice" value="${hfGood.taobaoPrice?long?c}"/>
                <input type="hidden" id="wholesalePrice" value="${hfGood.wholesalePrice?long?c}"/>
                <input type="hidden" id="size" value=""/>
                <input type="hidden" id="color" value=""/>
                <input type="hidden" id="title" value="${hfGood.title}"/>
                <input type="hidden" id="taobaoGoodId" value="${hfGood.taobaoGoodId?long?c}"/>
                <img src="${hfGood.bigPicture}" alt="">
            </#if>

                <div class="mask"></div>
            </div>
        <#if finalSmallPictures??>
            <div class="zoomSmall">
                <div class="wrapSmallImg">
                    <ul>
                        <li class="current"><img src="${finalSmallPictures[0]}" alt=""></li>
                        <#list finalSmallPictures as smallpicture>
                            <li><img src="${smallpicture}" alt=""></li>
                        </#list>
                    </ul>
                </div>
            </div>
        </#if>
            <div class="zoomLarge"><img src="" alt=""></div>
        </div>

        <!--商品sku-->
        <div class="item-wrap">
        <#if hfGood??>
            <div class="d-name">
                <a href="${hfGood.taobaoLink}" target="_blank">淘宝链接</a>
                <strong>
                ${hfGood.title}
                </strong>
            </div>
        </#if>
            <div class="summary">
            <#if hfGood??>
                <div class="summary-price">
                    <dl>
                        <dt>批发价</dt>
                        <dd>
                            <div class="em">
                                <i>￥</i>
                                <span id="price">${hfGood.wholesalePrice/100}</span>
                            </div>

                        </dd>
                    </dl>
                    <dl>
                        <dt>淘宝价</dt>
                        <dd>
                            <div class="org_price">
                                <i>¥</i>
                                <span>${hfGood.taobaoPrice/100}</span>
                            </div>
                        </dd>
                    </dl>
                </div>

                <div class="sku">
                    <dl>
                        <dt>货号</dt>
                        <dd>${hfGood.productNo}</dd>
                    </dl>
                    <dl>
                        <dt>上新时间</dt>
                        <dd>${(hfGood.launchTime)?string("yyyy-MM-dd H:mm:ss")!}</dd>
                    </dl>
                </div>
            </#if>

                <div class="choose">
                <#if colors??>
                    <dl class="attr">
                        <dt class="dt">颜色</dt>
                        <dd class="dd">
                            <ul>
                                <#list colors as color>
                                    <li class="goods-spec-item">
                                        <a href="javascript:;" onclick="gotColor(this)">${color}</a>
                                    </li>
                                </#list>
                            </ul>
                        </dd>
                    </dl>
                </#if>
                <#if sizes??>
                    <dl class="attr">
                        <dt class="dt">尺码</dt>
                        <dd class="dd">
                            <ul>
                                <#list sizes as size>
                                    <li class="goods-spec-item">
                                        <a href="javascript:;" onclick="gotSize(this)">${size}</a>
                                    </li>
                                </#list>
                            </ul>
                        </dd>
                    </dl>
                </#if>
                    <dl class="attr">
                        <dt class="dt">配件</dt>
                        <dd>
                            <div class="parts-ck">
                                <div class="checkbox-group">
                                    <input type="checkbox" id="one3" name="fu"/>
                                    <label for="one3">有</label>
                                </div>
                            </div>
                        </dd>
                    </dl>
                    <dl class="amount">
                        <dt class="dt">数量</dt>
                        <dd class="dd">
                            <div class="choose-amount">
                                <a class="amount-plus">+</a>
                                <input type="text" class="amount-input" value="1" data-max="1000" title="请输入购买量"
                                       id="num">
                                <a class="amount-minus disabled">-</a>
                            </div>
                            <a href="#" class="btn-special1 btn-lg add-cart" onclick="saveShoppingCart()">加入进货车</a>
                            <a href="#" class="btn-special1 hse btn-lg add-cart">商品已下架</a>
                            <div class="shoucang">
                                <a href="#" class="iconfont" onclick="saveFavorite()">&#xe61f;<br>
                                    <span>收藏</span></a>
                            </div>
                        </dd>
                    </dl>
                </div>
            </div>
        </div>

        <!--产品详情-->
        <div class="goodsinfo">
            <div class="spxq" id="moreDetailInfo">
                <h3>商品详情</h3>

            </div>
        </div>


    </div>

    <div class="fr item-right" >
        <h3>橱窗推荐</h3>
        <ul class="side-list" id="showcase">

        </ul>
    </div>

</div>


<!--底部-->
<#include "../common/footer.ftl" />
<@footer/>

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/lazyload.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript">
    
    function saveFavorite() {
        var taobaoGoodId = $('#taobaoGoodId').val();
        var title  = $('#title').val();
        var wholesalePrice =$('#wholesalePrice').val();
        var toabaoPrice = $('#taobaoPrice').val();
        var hfGoodId = $('#hfUid').val();
        $.ajax({
            url:"/user/saveFavoriteGoods",
            data:{"hfGoodId":hfGoodId,"title":title,"wholesalePrice":wholesalePrice,"taobaoPrice":toabaoPrice,"taobaoGoodId":taobaoGoodId},
            type:"post",
            success:function (data) {
                var dataObj = JSON.parse(data);
                if(dataObj.result.resultCode==8888){
                    window.alert("收藏成功!");
                }else{
                    window,alert("收藏失败")
                }
            }
        })

        
    }
    
    
    $(function () {

        //筛选选中
        $(".types a").click(function () {
            $(this).addClass('on').siblings().removeClass('on');
        })

        //图片延迟加载
        $("img.lazy").lazyload({
            effect: "fadeIn"
        });


        //加减按钮
        $("#num").keyup(function () {
            var obj = $(this);
            var r = /^\d+$/;
            if (!r.test(obj.val())) {
                obj.val(1);
                $.msg("请输入数字");
            } else {
                if (parseInt(obj.val()) > parseInt(obj.attr("data-max"))) {
                    obj.val(obj.attr("data-max"));
                }
                if (parseInt(obj.val()) <= 0) {
                    obj.val(1);
                }
            }
        })
        $(".amount-plus").click(function () {
            var obj = $("#num");
            var num = parseInt(obj.val());
            var max = parseInt(obj.attr("data-max"));
            num++;
            if (num > max) {
                obj.val(max);
            } else {
                obj.val(num);
            }
        })
        $(".amount-minus").click(function () {
            var obj = $("#num");
            var num = parseInt(obj.val());
            if (num > 1) {
                num--;
                obj.val(num);
            }
        })

        //规格选择
        $(".goods-spec-item").click(function () {
            if ($("#hidden_shipping_fee_name").val() != "无货") {
                $(this).siblings(".selected").removeClass("selected").find("i").remove();
                $(this).addClass("selected");
                if ($(this).find("a i").length == 0) {
                    $(this).find("a").append("<i></i>");
                }
            }
        }).click(function () {
            //$(this).addClass("selected");
        }, function () {
            if ($(this).find("i").size() == 0) {
                $(this).removeClass("selected");
            }
        });


    });

    $(document).ready(function () {
        var hfUid = $('#hfUid').val();
        $.ajax({
            type: "POST",
            url: "/moreGoodInfo",
            data: "hfUid=" + hfUid,
            success: function (data) {
                var hfGood = JSON.parse(data);
                $('#moreDetailInfo').append(hfGood.attributes );
                $('#moreDetailInfo').append(hfGood.goodInfo)
            }
        });
    });

    $(document).ready(function () {
        var shopId = $('#shopId').val();
        $.ajax({
            type: "POST",
            url: "/showcaseInfo",
            data: "shopId=" + shopId,
            success: function (data) {
                var hfGood = JSON.parse(data);
                var html = [];
                for(var i=0;i<hfGood.length;i++){
                    html.push('<li><a href="/goodInfo?hfUid=');
                    html.push(hfGood[i].hfUid);
                    html.push('"');
                    html.push('target="_blank"><div class="pic"><img src="');
                    html.push(hfGood[i].bigPicture);
                    html.push('" alt=""> </div> </a> <div class="price"><span class="yuan">¥</span>');
                    html.push('');
                    html.push(hfGood[i].taobaoPrice/100);
                    html.push(' </div> <div class="pos">');
                    html.push(hfGood[i].title);
                    html.push('</div> </li>');
                }

                $('#showcase').html(html.join(''));
            }
        });
    });

    function saveShoppingCart(){
        var hfUid = $('#hfUid').val();
        var shopId = $('#shopId').val();
        var userId = $('#userId').val();
        var taobaoPrice = $('#taobaoPrice').val();
        var wholesalePrice = $('#wholesalePrice').val();
        var size = $('#size').val();
        var color = $('#color').val();
        var goodTitle = $('#title').val();
        var num = $('#num').val();
        $.ajax({
            type: "POST",
            url: "/cart/saveShoppingCart",
            data: {"goodTitle":goodTitle,"hfGoodId":hfUid,"shopId":shopId,"userId":userId,"color":color,"size":size,"taobaoPrice":taobaoPrice,"wholesalePrice":wholesalePrice,"count":num},
            success: function (data) {
              var dataObj = JSON.parse(data);
                if(dataObj.result.resultCode==8888){
                    alert("加入成功");
                }else{
                    alert("加入失败，请稍后再试！！");
                }
            }
        });
    }

    function gotColor(element){
       $('#color').val($(element).text());
    }
    function gotSize(element){
        $('#size').val($(element).text());
    }
</script>
</body>

</html>